import Layout from '../components/layout'
import Link from 'next/link'
const linkStyle = {
  marginRight: 15
}
const PostLink = (props)=>{
  return (
    <Link  as={`/p/${props.id}`} href={`/post?id=${props.id}`}>
      <a style={linkStyle}>{props.id}</a>
    </Link>
  )
}

export default () => {
  return  (
    <div>
      <Layout>
          <h1>Hello Next.js</h1>
          <ul>
             <PostLink id="hello-nextjs" />
             <PostLink id="learn-nextjs" />
             <PostLink id="deploy-nextjs" />
           </ul>
      </Layout>
    </div>
    )
}
